<template>
  <div>
      <Input type="text" v-model="search.text" :placeholder="search.placeholder"></Input>
      <Button type="primary" >Submit</Button>
      <Table border :columns="columns7" :data="data6"></Table>
      <Page :total="100"></Page>
  </div>
</template>
<script>
   export default {
     data () {
       return {
         url: '/employee',
         search: {
           text: '',
           placeholder: '请输入'
         },
         page: {},
         total: 0,
         columns7: [
           {
             title: 'Name',
             key: 'name',
             render: (h, params) => {
               return h('div', [
                 h('Icon', {
                   props: {
                     type: 'person'
                   }
                 }),
                 h('strong', params.row.name)
               ])
             }
           },
           {
             title: 'Age',
             key: 'age'
           },
           {
             title: 'Address',
             key: 'address'
           },
           {
             title: 'Action',
             key: 'action',
             width: 150,
             align: 'center',
             render: (h, params) => {
               return h('div', [
                 h('Button', {
                   props: {
                     type: 'primary',
                     size: 'small'
                   },
                   style: {
                     marginRight: '5px'
                   },
                   on: {
                     click: () => {
                       this.show(params.index)
                     }
                   }
                 }, 'View'),
                 h('Button', {
                   props: {
                     type: 'error',
                     size: 'small'
                   },
                   on: {
                     click: () => {
                       this.remove(params.index)
                     }
                   }
                 }, 'Delete')
               ])
             }
           }
         ],
         data6: [
           {
             name: 'John Brown',
             age: 18,
             address: 'New York No. 1 Lake Park'
           },
           {
             name: 'Jim Green',
             age: 24,
             address: 'London No. 1 Lake Park'
           },
           {
             name: 'Joe Black',
             age: 30,
             address: 'Sydney No. 1 Lake Park'
           },
           {
             name: 'Jon Snow',
             age: 26,
             address: 'Ottawa No. 2 Lake Park'
           }
         ]
       }
     },
     methods: {
       show (index) {
         this.$Modal.info({
           title: 'User Info',
           content: `Name：${this.data6[index].name}<br>Age：${this.data6[index].age}<br>Address：${this.data6[index].address}`
         })
       },
       remove (index) {
         this.data6.splice(index, 1)
       }
     },
     mounted () {
       window.$.ajax({
         type: 'post',
         url: 'http://101.132.156.26:1000/employee/find',
         data: {
           'fields': {
             'value': '1'
           },
           'page_no': 0,
           'page_size': 20,
           'sort_fields': 'id,create_date',
           'sort_type': 'DESC'
         }
       }).then((d) => {
         console.log(d)
       })
     }
   }
</script>
<style>

</style>
